<!-- ko if:_showForm -->
<form data-bind="attr:{id:_id}" class="needs-validation" novalidate onsubmit="return false;">
    <!-- ko foreach:_fieldSets -->
    <div class="card">
        <!-- ko if:name -->
        <div class="card-header">
            <span class="font-weight-bold" data-bind="text:name"></span>
            <div class="float-right"><span class="zi zi_menu"
                                           data-bind="attr:{'data-target':'#form_fieldset_'+ $index()}"
                                           data-toggle="collapse"></span></div>
        </div>
        <!-- /ko -->
        <div data-bind="attr:{id:'form_fieldset_'+ $index()}" class="collapse show">
            <div class="card-body pt-3 pl-3 pr-3 pb-0">
                <div class="form-row">
                    <!-- ko foreach:_fields -->
                    <div class="form-group" data-bind="css:_colCss">
                        <div class="row">
                            <label class="pt-1 pr-2" data-bind="text:alias,attr:{for:_attr.id},css:_labelCss"></label>
                            <div data-bind="css:_inputCss">
                                <!-- ko if:type=='text' || type=='password' || type=='date' || type=='number' || type=='email'-->
                                <input class="form-control"
                                       data-bind="value:$parents[1].record[name],enable:!$parents[1].isView(name),attr:_attr,event:{blur:$parents[1].onFieldBlur}"/>
                                <div class="invalid-tooltip"
                                     data-bind="text:$parents[1].record.getField(name).validateMessage"></div>
                                <!-- /ko -->
                                <!-- ko if:type=="textarea" -->
                                <textarea class="form-control"
                                          data-bind="value:$parents[1].record[name],enable:!$parents[1].isView(name),attr:_attr"/>
                                <div class="invalid-tooltip"
                                     data-bind="text:$parents[1].record.getField(name).validateMessage"></div>
                                <!-- /ko -->
                                <!-- ko if:type=='select' -->
                                <select class="form-control" data-bind="options: options,
                                    optionsText: optionsText,
                                    optionsValue: optionsValue,
                                    value: $parents[1].record[name],
                                    valueAllowUnset:true,
                                    optionsCaption: '请选择...',enable:!$parents[1].isView(name),attr:_attr"></select>
                                <div class="invalid-tooltip"
                                     data-bind="text:$parents[1].record.getField(name).validateMessage"></div>
                                <!-- /ko -->
                                <!-- ko if:type == 'checkbox' -->
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox"
                                           data-bind="checked:$parents[1].record[name],enable:!$parents[1].isView(name),attr:_attr">
                                    <label class="form-check-label" data-bind="text:label,attr:{for:_attr.id}"></label>
                                </div>
                                <!-- /ko -->
                                <!-- ko if:type == 'button' -->
                                <input type="button"
                                       data-bind="value:value,css:__inputCss,click:$parents[1]._onFormButtonClick"/>
                                <!-- /ko -->
                                <!-- ko if:type=='file'-->
                                <!-- ko ifnot:$parents[1].isView(name) -->
                                <div class="custom-file">
                                    <input type="file" class="custom-file-input"
                                           data-bind="fileInput: $parents[1].record[name],attr:_attr">
                                    <label class="custom-file-label"
                                           data-bind="attr:{for:_attr.id},text:$parents[1].record[name].file()==undefined?_attr.placeholder:$parents[1].record[name].file().name"></label>
                                    <div class="invalid-tooltip"
                                         data-bind="text:$parents[1].record.getField(name).validateMessage"></div>
                                </div>
                                <!-- /ko -->
                                <!-- ko if:preview-->
                                <!-- ko if:_mimeType == 'img' && $parents[1].record['_preview_' + name]() -->
                                <img data-bind="attr:{src:$parents[1].record['_preview_' + name]}"
                                     class="img-fluid img-thumbnail mt-2" alt="">
                                <!-- /ko -->
                                <!-- /ko -->
                                <!-- /ko -->
                                <!-- ko if:type=='tree' || type=='shuttle' || type=='checkboxes'-->
                                <!-- ko component:{name:_customCmp,params:{field:$data,record:$parents[1].record}} -->
                                <!-- /ko -->
                                <!-- /ko -->
                            </div>
                        </div>
                    </div>
                    <!-- /ko -->
                </div>
            </div>
        </div>
    </div>
    <!-- /ko -->
    <!-- ko if:_showButtons -->
    <div class="text-center">
        <!-- ko foreach:_buttons -->
        <button data-bind="css:$root.buttonCss.primary,text:title,click:$parent._onButtonClick"></button>
        <!-- /ko -->
    </div>
    <!-- /ko -->
</form>
<!-- /ko -->

